<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <!--{include file='comm/header.tpl'}-->
    <!--{include file='comm/comm_editor.tpl'}-->
    <title>商品录入-商品主信息</title>
</head>
<style>
.img-left{
	float:left;
	margin-left:12px;
}

.img-delete{
	width:160px;
	height:48px;
	line-height:48px;
	text-align:center;
}
.img-thumbnail{
	width:160px;
	height:160px;
}

</style>
<body>

<div class="container">

    <div class="comm_content" style="margin-bottom:48px;">
        	<ul role="tablist" class="nav nav-tabs">
				<li class="group_box active">
					<a href="javascript:void(0);">商品主信息</a>
				</li>
                <button type="button" class="btn btn-primary" style="float: right;margin:4px 15px 0px 0px;" onclick="history.go(-1)">返回上一级</button>
            </ul>
			
        	<form name="addForm" id="addForm" class="form-horizontal">
        		<!--用于判断是商品添加还是商品编辑-->
        		<input type="hidden" name="postID" id="postID" value="<!--{$editInfo->postID}-->">
				<div class="form-group" style="width:800px;padding:10px;margin-bottom:0px;">
					<label class="col-sm-3 control-label" for="cityID" style="width:18%;"><span class="red">*</span> 商品所属城市：</label>
					<div class="col-sm-9" style="width:82%;">
						<select name="cityID" id="cityID" class="form-control w150" disabled>
							<option value="0">请选择</option>
							<!--{foreach from=$city item=c}-->
								<option value="<!--{$c.id}-->"><!--{$c.name}--></option>
							<!--{/foreach}-->
						</select>
					</div>
				</div>
				
				<div class="form-group" style="width:800px;padding:10px;margin-bottom:0px;">
					<label class="col-sm-3 control-label" for="categoryID" style="width:18%;"><span class="red">*</span> 商品类目：</label>
					<div class="col-sm-9" style="width:82%;">
						<select name="categoryID" id="categoryID" class="form-control w150" disabled>
							<option value="0">请选择</option>
							<!--{foreach from=$category item=c}-->
								<option value="<!--{$c.bigCategoryID}-->"><!--{$c.name}--></option>
							<!--{/foreach}-->
						</select>
					</div>
				</div>
				
				<div class="form-group" style="width:800px;padding:10px;margin-bottom:0px;">
					<label class="col-sm-3 control-label" for="goods-name" style="width:18%;"><span class="red">*</span> 商品名称：</label>
					<div class="col-sm-9" style="padding-left:0px;width:82%;">
						<div class="form-group">
							<label class="col-sm-3 control-label" for="goodsName" style="width:9%;">中文</label>
							<div class="col-sm-9" style="padding:0px;width:91%;">
								<input type="text" name="goodsName" id="goodsName" class="form-control w300" maxlength="15" disabled>
							</div>
						</div>
						<div class="form-group">
							<label class="col-sm-3 control-label" for="frenchName" style="width:9%;">法文</label>
							<div class="col-sm-9" style="padding:0px;width:91%;">
								<input type="text" name="frenchName" id="frenchName" class="form-control w300" maxlength="30" disabled>
							</div>
						</div>
					</div>
				</div>
				
				<div class="form-group" style="padding:10px;margin-bottom:0px;display:none;">
					<label class="col-sm-3 control-label" for="goods-pictrue" style="width:11%;"><span class="red">*</span> 商品图片：</label>
					<div class="col-sm-9" style="width:89%;">
						<div class="img-1 img-left">
							<img src="/quanliadmin/docroot/images/backend/default.jpg" class="img-thumbnail">
							<input type="hidden" id="imgname_1" name="imgname_1">
							<div class="img-delete">
								<input type="text"  disabled id="iSort_1" name="iSort_1" value="请输入排序" style="width:82px;height:28px;line-height:28px;padding-left:6px;color:gray;">
							</div>
						</div>
						<div class="img-2 img-left">
							<img src="/quanliadmin/docroot/images/backend/default.jpg" class="img-thumbnail">
							<input type="hidden" id="imgname_2" name="imgname_2">
							<div class="img-delete">
								<input type="text" id="iSort_2" disabled name="iSort_2" value="请输入排序" style="width:82px;height:28px;line-height:28px;padding-left:6px;color:gray;">
							</div>
						</div>
						<div class="img-3 img-left">
							<img src="/quanliadmin/docroot/images/backend/default.jpg" class="img-thumbnail">
							<input type="hidden" id="imgname_3" name="imgname_3">
							<div class="img-delete">
								<input type="text" id="iSort_3" disabled name="iSort_3" value="请输入排序" style="width:82px;height:28px;line-height:28px;padding-left:6px;color:gray;">
							</div>
						</div>
						<div class="img-4 img-left">
							<img src="/quanliadmin/docroot/images/backend/default.jpg" class="img-thumbnail">
							<input type="hidden" id="imgname_4" name="imgname_4">
							<div class="img-delete">
								<input type="text" id="iSort_4" disabled name="iSort_4" value="请输入排序" style="width:82px;height:28px;line-height:28px;padding-left:6px;color:gray;">
							</div>	
						</div>
						<div class="img-5 img-left">
							<img src="/quanliadmin/docroot/images/backend/default.jpg" class="img-thumbnail">
							<input type="hidden" id="imgname_5" name="imgname_5">
							<div class="img-delete">
								<input type="text" id="iSort_5" disabled name="iSort_5" value="请输入排序" style="width:82px;height:28px;line-height:28px;padding-left:6px;color:gray;">
							</div>
						</div>
						<!--封面-->
						<input type="hidden" id="cover" name="cover">
						<div style="clear:both;"></div>
					</div>
				</div>
				
				<div class="form-group" style="width:800px;padding:10px;margin-bottom:0px;">
					<label class="col-sm-3 control-label" for="goodsPicTitle" style="width:18%;"><span class="red">*</span> 图片title：</label>
					<div class="col-sm-9" style="width:82%;">
						<input type="text" name="goodsPicTitle" id="goodsPicTitle" class="form-control w300" maxlength="200" disabled style="display:inline-block;">
					</div>
				</div>
				
				<div class="form-group" style="width:800px;padding:10px;margin-bottom:0px;">
					<label class="col-sm-3 control-label" for="goodsPicAlt" style="width:18%;"><span class="red">*</span> 图片alt：</label>
					<div class="col-sm-9" style="width:82%;">
						<input type="text" name="goodsPicAlt" id="goodsPicAlt" class="form-control w300" maxlength="200" disabled style="display:inline-block;">
					</div>
				</div>
				
				<div class="form-group" style="width:800px;padding:10px;margin-bottom:0px;">
					<label class="col-sm-3 control-label" for="goods-name" style="width:18%;"><span class="red">*</span> 商品介绍文案：</label>
					<div class="col-sm-9" style="padding-left:0px;width:82%;">
						<div class="form-group">
							<div class="col-sm-9" style="padding:0px;margin-left:16px;">
								<font style="font-weight:bold;">中文</font>&nbsp;&nbsp;&nbsp;<font color="Red">最多150个汉字</font>
								<textarea name="chineseBrief" id="chineseBrief" class="form-control w300" disabled style="height:148px;"><!--{$editInfo->chineseBrief}--></textarea>
							</div>
						</div>
						<div class="form-group">
							<div class="col-sm-9" style="padding:0px;margin-left:16px;">
								<font style="font-weight:bold;">法文</font>&nbsp;&nbsp;&nbsp;<font color="Red">最多300个字符</font>
								<textarea name="frenchBrief" id="frenchBrief" disabled class="form-control w300" style="height:148px;"><!--{$editInfo->frenchBrief}--></textarea>
							</div>
						</div>
					</div>
				</div>
				
				<div class="form-group" style="width:800px;padding:10px;margin-bottom:0px;">
					<label class="col-sm-3 control-label" for="basicGroupID" style="width:18%;"><span class="red">*</span> 商品基本信息：</label>
					<div class="col-sm-9" style="width:82%;">
						<div>
							<select name="basicGroupID" disabled id="basicGroupID" class="form-control w300" multiple style="display:inline-block;height:110px;">
								<!--{foreach from=$basicGroup item=bg}-->
									<option value="<!--{$bg.basicGroupID}-->"><!--{$bg.chinese}--></option>
								<!--{/foreach}-->
							</select>
						</div>
						<div id="basicSel">
							<table><!--{$editInfo->basicTr}--></table>
						</div>
					</div>
				</div>
				
				<div class="form-group" style="width:800px;padding:10px;margin-bottom:0px;">
					<label class="col-sm-3 control-label" for="materID" style="width:18%;"><span class="red">*</span> 原材料信息：</label>
					<div class="col-sm-9" style="width:82%;">
						<div>
							<select name="materID" disabled id="materID" class="form-control w300" multiple style="display:inline-block;height:110px;">
								<!--{foreach from=$mater item=m}-->
									<option value="<!--{$m.materID}-->"><!--{$m.materName}--></option>
								<!--{/foreach}-->
							</select>
						</div>
						<div id="materSel">
							<table><!--{$editInfo->materTr}--></table>
						</div>
					</div>
				</div>
				
				<div class="form-group" style="width:800px;padding:10px;margin-bottom:0px;">
					<label class="col-sm-3 control-label" for="tag" style="width:18%;"><span class="red">*</span> 商品TAG：</label>
					<div class="col-sm-9" style="width:82%;">
						<input type="text" name="tag" id="tag" class="form-control w300" disabled>
					</div>
				</div>
				
	        </form>  
        </div>

</div>
<!--{include file='comm/footer.tpl'}-->
</body>
</html>
<script>
	
	//图片上传
    KindEditor.ready(function(K) {
        var editor = K.editor({
            allowFileManager : true,
            uploadJson: '/framework/kindeditor/php/upload_json.php'
        });
        
        $(document).on('click','#upload_1',function(){
            editor.loadPlugin('image', function() {
                editor.plugin.imageDialog({
                    showRemote : false,
                    clickFn : function(url) {
                    	//对url进行操作
                    	var urlArray = url.split('/');
                    	var urlCount = urlArray.length;
                    	var urlTime = urlCount - 2;
                    	var urlPath = urlCount - 1;
                    	var name = urlArray[urlTime] + '/' + urlArray[urlPath];			
                    	
                    	$('.img-1 img').attr('src', url);
			            $('#imgname_1').val(name);
                        editor.hideDialog();
                    }
                });
            });
        });
        
        $(document).on('click','#upload_2',function(){
            editor.loadPlugin('image', function() {
                editor.plugin.imageDialog({
                    showRemote : false,
                    clickFn : function(url) {
                    	//对url进行操作
                    	var urlArray = url.split('/');
                    	var urlCount = urlArray.length;
                    	var urlTime = urlCount - 2;
                    	var urlPath = urlCount - 1;
                    	var name = urlArray[urlTime] + '/' + urlArray[urlPath];			
                    	
                    	$('.img-2 img').attr('src', url);
			            $('#imgname_2').val(name);
                        editor.hideDialog();
                    }
                });
            });
        });
        
        $(document).on('click','#upload_3',function(){
            editor.loadPlugin('image', function() {
                editor.plugin.imageDialog({
                    showRemote : false,
                    clickFn : function(url) {
                    	//对url进行操作
                    	var urlArray = url.split('/');
                    	var urlCount = urlArray.length;
                    	var urlTime = urlCount - 2;
                    	var urlPath = urlCount - 1;
                    	var name = urlArray[urlTime] + '/' + urlArray[urlPath];				
                    	
                    	$('.img-3 img').attr('src', url);
			            $('#imgname_3').val(name);
                        editor.hideDialog();
                    }
                });
            });
        });
        
        $(document).on('click','#upload_4',function(){
            editor.loadPlugin('image', function() {
                editor.plugin.imageDialog({
                    showRemote : false,
                    clickFn : function(url) {
                    	//对url进行操作
                    	var urlArray = url.split('/');
                    	var urlCount = urlArray.length;
                    	var urlTime = urlCount - 2;
                    	var urlPath = urlCount - 1;
                    	var name = urlArray[urlTime] + '/' + urlArray[urlPath];				
                    	
                    	$('.img-4 img').attr('src', url);
			            $('#imgname_4').val(name);
                        editor.hideDialog();
                    }
                });
            });
        });
        
        $(document).on('click','#upload_5',function(){
            editor.loadPlugin('image', function() {
                editor.plugin.imageDialog({
                    showRemote : false,
                    clickFn : function(url) {
                    	//对url进行操作
                    	var urlArray = url.split('/');
                    	var urlCount = urlArray.length;
                    	var urlTime = urlCount - 2;
                    	var urlPath = urlCount - 1;
                    	var name = urlArray[urlTime] + '/' + urlArray[urlPath];			
                    	
                    	$('.img-5 img').attr('src', url);
			            $('#imgname_5').val(name);
                        editor.hideDialog();
                    }
                });
            });
        });
    });
    
    //商品主信息添加操作对象
	var goodsAdd = {
		
		bcount: 1,
		
		mcount: 1,
		
		//默认商品图片路径
		path: '/quanliadmin/docroot/images/backend/default.jpg',
		
		//基本信息添加
		openBasic: function(){
			window.open('/quanliadmin/app/goods/goodsBasic.pscript?operFlg=1');
		},
		
		//原材料添加
		openMater: function(){
			window.open('quanliadmin/app/goods/goodsMater.pscript?operFlg=1');
		},
		
		//设置为封面
		setCover: function(flg){
			var imgname = $('#imgname_' + flg).val();
			if (imgname == '') {
				E.alert('请上传商品图片');
				return false;
			}
			
			for(var i=1; i<=5; i++) {
				$('#cover_' + i).removeClass('btn-danger').addClass('btn-default');
			}
			
			$('#cover_' + flg).removeClass('btn-default').addClass('btn-danger');
			$('#cover').val(flg);
		},
		
		//删除图片
		clear: function(flg){
			$('.img-' + flg + ' img').attr('src', this.path);
			$('#imgname_' + flg).val('');
			var cover = $('#cover').val();
			if (cover == flg) {
				$('#cover').val('');
			}
		},
		
		//批量添加基本信息
		batchBasic: function(){
			var error_msg = '';
			var l = $('#basicGroupID option:checked').length;
			if (l <= 0) {
				E.alert('请添加商品基本信息');
				return false;
			}
			
			var params = [];
			$('#basicGroupID option:checked').each(function(k, v){
				var pid = $(v).attr('value');
				if ($('#basic_' + pid).length > 0) {
					error_msg = '商品基本信息「'+$(v).text()+'」已添加';
					return false;
				}
				params.push(pid);
			})
			
			if (error_msg != '') {
				E.alert(error_msg);
				return false;
			}
			
			E.loadding.open();
			E.ajax_post({
				url : '/invokingAjax-backend/goods/goodsAdd.ajax?operFlg=1',
				data: {
					params: params
				},
				call: 'goodsAdd.basicBack'
			});
		},
		
		//基本信息值展示
		basicBack: function(o){
			E.loadding.close();
			if (o.code == 200) {
				$('#basicSel table').append(o.data);
				
				$.each(o.sort, function(k, v){
					$('#bsort_' + v).val(goodsAdd.bcount);
					goodsAdd.bcount++;
				})
			} else {
				E.alert(o.message);
			}
		},
		
		//批量添加原材料
		batchMater: function(){
			var error_msg = '';
			var l = $('#materID option:checked').length;
			if (l <= 0) {
				E.alert('请添加商品原材料信息');
				return false;
			}
			
			var params = [];
			$('#materID option:checked').each(function(k, v){
				var mid = $(v).attr('value');
				if ($('#mater_' + mid).length > 0) {
					error_msg = '商品原材料信息「'+$(v).text()+'」已添加';
					return false;
				}
				params.push(mid);
			})
			
			if (error_msg != '') {
				E.alert(error_msg);
				return false;
			}
			
			E.loadding.open();
			E.ajax_post({
				url : '/invokingAjax-backend/goods/goodsAdd.ajax?operFlg=2',
				data: {
					params: params
				},
				call: 'goodsAdd.materBack'
			});
		},
		
		//原材料值展示
		materBack: function(o){
			E.loadding.close();
			if (o.code == 200) {
				$('#materSel table').append(o.data);
				
				$.each(o.sort, function(k, v){
					$('#msort_' + v).val(goodsAdd.mcount);
					goodsAdd.mcount++;
				})
			} else {
				E.alert(o.message);
			}
		},
		
		//删除新建商品基本信息
		basicClear: function(flg){
			$('#basic_' + flg).remove();
		},
		
		//删除新建商品原材料信息
		materClear: function(flg){
			$('#mater_' + flg).remove();
		},
		
		//保存检查
		check: function(){
			
			var error_msg = '';
			this.dt = E.getFormValues('addForm');

			//商品图片
			var imgcount = 0;
			for (var i=1; i<=5; i++) {
				var imgname = $('#imgname_' + i).val();
				var imgsort = $('#iSort_' + i).val();
				if (imgname == '' && i == parseInt(this.dt.cover)) {
					error_msg += '设置商品图片封面错误，请重新操作<br/>';
					break;
				}
				
				if (imgname != '') {
					imgcount++;
					if (!E.isInt(imgsort)) {
						error_msg += '请填写正确的商品图片排序<br/>';
						break;
					}
				}
			}

			if (imgcount <= 0) {
				error_msg += '请上传商品图片<br/>';
			} else if (this.dt.cover == '') {
				error_msg += '请设置商品图片封面<br/>';
			}
			
			//图片 title
			if (this.dt.goodsPicTitle == '') {
				error_msg += '请填写图片title<br/>';
			}
			
			//图片alt
			if (this.dt.goodsPicAlt == '') {
				error_msg += '请填写图片alt<br/>';
			}
			
			//文案
			if (this.dt.chineseBrief == '') {
				error_msg += '请填写商品中文介绍文案<br/>';
			} else {
				if (this.dt.chineseBrief.length > 150) {
					error_msg += '商品中文介绍文案必须在150个汉字以内<br/>';
				}
			}
			
			if (this.dt.frenchBrief == '') {
				error_msg += '请填写商品法文介绍文案<br/>';
			} else {
				if (this.dt.frenchBrief.length > 300) {
					error_msg += '商品法文介绍文案必须在300个汉字以内<br/>';
				}
			}
			
			//基本信息
			var bl = $('[id^=basic_]').length;
			if (bl <= 0) {
				error_msg += '请选择商品基本信息<br/>';
			} else {
				
				$('[id^=basicID_]').each(function(k, v){
					if (!E.isInt($(v).val()) || $(v).val() <= 0) {
						error_msg += '请选择商品基本信息<br/>';
						return false;
					}
				});
				
				$('[id^=bsort_]').each(function(k, v){
					if (!E.isInt($(v).val()) || $(v).val() <= 0) {
						error_msg += '请填写正确的商品基本信息排序<br/>';
						return false;
					}
				});
			}
			
			//原材料信息
			var ml = $('[id^=mater_]').length;
			if (ml <= 0) {
				error_msg += '请选择商品原材料信息<br/>';
			} else {
				$('[id^=msort_]').each(function(k, v){
					if (!E.isInt($(v).val()) || $(v).val() <= 0) {
						error_msg += '请填写正确的商品原材料信息排序<br/>';
						return false;
					}
				})
			}
			
			//商品标签
			if (this.dt.tag == '') {
				error_msg += '请填写商品TAG<br/>';
			}
			
			if (error_msg != '') {
				E.alert(error_msg);
			} else {
				E.confirm('您确认添加此商品吗？', 'goodsAdd.save');
			}
		},
		
		//ajax保存
		save: function(){
			E.loadding.open();
			E.ajax_post({
				url : '/invokingAjax-backend/goods/goodsAdd.ajax?operFlg=3',
				data: {
					params: goodsAdd.dt
				},
				call: 'goodsAdd.saveBack'
			});
		},
		
		//添加商品后返回刷新页面
		saveBack: function(o){
			E.loadding.close();
			if (o.code == 200) {
				E.alert(o.message, 2, 'E.refresh');
				//E.alert(o.message, 2);
			} else {
				E.alert(o.message);
			}
		}
	}
	
	$(function(){
		//编辑初始化
		<!--{if isset($editInfo) && $editInfo != ''}-->
			$('#cityID').val('<!--{$editInfo->cityID}-->');
			$('#categoryID').val('<!--{$editInfo->bigCategoryID}-->');
			$('#goodsName').val('<!--{$editInfo->goodsName}-->');
			$('#frenchName').val('<!--{$editInfo->frenchName}-->');
			$('#goodsPicTitle').val('<!--{$editInfo->goodsPicTitle}-->');
			$('#goodsPicAlt').val('<!--{$editInfo->goodsPicAlt}-->');
			$('#tag').val('<!--{$editInfo->tag}-->');
			$('#entryC').text('<!--{$editInfo->chineseBriefCount}-->');
			$('#entryF').text('<!--{$editInfo->frenchBriefCount}-->');
			goodsAdd.bcount = '<!--{$editInfo->bcount}-->';
			goodsAdd.mcount = '<!--{$editInfo->mcount}-->';
			<!--{if isset($editInfo->bSelectSort) && $editInfo->bSelectSort != ''}-->
				<!--{foreach from=$editInfo->bSelectSort item=sort}-->
					$('#basicID_<!--{$sort.gid}-->').val('<!--{$sort.bid}-->');
					$('#bsort_<!--{$sort.gid}-->').val('<!--{$sort.sortOrder}-->');
				<!--{/foreach}-->	
			<!--{/if}-->
			
			<!--{if isset($editInfo->mSelectSort) && $editInfo->mSelectSort != ''}-->
				<!--{foreach from=$editInfo->mSelectSort item=sort}-->
					$('#msort_<!--{$sort.mid}-->').val('<!--{$sort.sortOrder}-->');
				<!--{/foreach}-->	
			<!--{/if}-->
		<!--{/if}-->
		
		<!--{if isset($picture) && $picture != ''}-->
		
			<!--{foreach from=$picture key=k item=p}-->
				$('#imgname_<!--{$k+1}-->').val('<!--{$p.orgitalLink}-->');
				$('.img-<!--{$k+1}--> img').attr('src', '<!--{$p.pictureLink}-->');
				$('#iSort_<!--{$k+1}-->').val('<!--{$p.sortOrder}-->').css('color','black');
				<!--{if $p.mainFlg == 1}-->
					$('#cover_<!--{$k+1}-->').removeClass('btn-default').addClass('btn-danger');
					$('#cover').val('<!--{$k+1}-->');
				<!--{/if}-->
			<!--{/foreach}-->
		<!--{/if}-->
		
		//图片排序
		$('[id*=iSort_]').focus(function(){
			$(this).css('color','black');
			var sort = E.trim($(this).val());
			if (sort == '请输入排序') {
				$(this).val('');
			}
		}).blur(function(){
			var sort = E.trim($(this).val());
			if (sort == '') {
				$(this).css('color','gray');
				$(this).val('请输入排序');
			}else if (!E.isInt(sort) || sort <= 0) {
				$(this).css('color','gray');
				$(this).val('请输入排序');
				E.alert('图片排序必须为大于0的正整数');
			}
		})
		
		//商品介绍文案(中文)
		$('#chineseBrief').keyup(function(e){
			var len = $(this).val().length;
			if (len > 150) {
				var v = $(this).val();
				var vr = v.replace(v.substring(150),'');
				$(this).val(vr);
			} else {
				$('#entryC').text(150 - parseInt(len));
			}
		})
		
		//商品介绍文案(法文)
		$('#frenchBrief').keyup(function(e){
			var len = $(this).val().length;
			if (len > 300) {
				var v = $(this).val();
				var vr = v.replace(v.substring(300),'');
				$(this).val(vr);
			} else {
				$('#entryF').text(300 - parseInt(len));
			}
		})
	})
	
</script>